import { motion } from "framer-motion";

export default function Navbar({ toggleSidebar }: { toggleSidebar: () => void }) {
  return (
    <header className="bg-[#2C3E50] text-white shadow-sm">
      <div className="flex items-center justify-between px-6 py-4">
        <div className="flex items-center space-x-4">
          <button 
            onClick={toggleSidebar}
            className="text-white focus:outline-none"
          >
            <i className="fas fa-bars text-xl"></i>
          </button>
          
          {/* 校徽和标题 */}
          <div className="flex items-center">
            <div className="w-10 h-10 bg-white rounded-full flex items-center justify-center mr-3">
              <i className="fas fa-school text-[#2C3E50] text-xl"></i>
            </div>
            <h1 className="text-xl font-bold">学生成绩管理系统</h1>
          </div>
        </div>
        
        {/* 右侧功能区 */}
        <div className="flex items-center space-x-6">
          <div className="flex items-center">
            <i className="fas fa-chalkboard-teacher mr-2"></i>
            <span>教师</span>
          </div>
          
          <button className="relative">
            <i className="fas fa-bell text-xl"></i>
            <span className="absolute top-0 right-0 w-2 h-2 bg-[#E74C3C] rounded-full"></span>
          </button>
        </div>
      </div>
    </header>
  );
}
